import { ref, reactive } from 'vue';
import { useRouter } from 'vue-router';
import { useProjectDetailStore } from '@/store';
import {
  getTableData as QueryList,
  changeStatus,
  copyTableItem,
} from '@/api/project/project';
import type { SeachData, TableListItem } from '@/api/project/project.d';
import { Message, TableColumnData } from '@arco-design/web-vue';
import type { CallBackData } from '@/components/dialog/type';

export default function useTableData(searchForm: SeachData) {
  const ProjectDetailStore = useProjectDetailStore();
  const data = ref<TableListItem[]>([]);
  const dataTotal = ref(0);

  const router = useRouter();

  const columns = ref<TableColumnData[]>([
    {
      title: '任务ID',
      dataIndex: 'id',
      width: 120,
      fixed: 'left',
    },
    {
      title: '任务名称',
      dataIndex: 'name',
      width: 240,
      fixed: 'left',
      ellipsis: true,
      tooltip: true,
    },
    {
      title: '标注单位',
      width: 120,
      dataIndex: 'companyList',
      slotName: 'companyList',
    },
    {
      title: '任务标签',
      width: 140,
      dataIndex: 'label',
      slotName: 'label',
    },
    {
      title: '序列总量',
      width: 138,
      dataIndex: 'summation',
      slotName: 'summationData',
      titleSlotName: 'summation',
    },
    {
      title: '病灶数量',
      width: 96,
      dataIndex: 'iarCount',
    },
    {
      title: '未标注序列数量',
      width: 138,
      dataIndex: 'unSubmitedSeriesCount',
    },
    {
      title: '已提交序列数量',
      width: 138,
      dataIndex: 'submitedSeriesCount',
      titleSlotName: 'submitedSeriesCount',
    },
    {
      title: '任务方式',
      width: 96,
      dataIndex: 'pubMethod',
      slotName: 'pubMethod',
    },
    {
      title: '任务目标',
      width: 96,
      dataIndex: 'target',
      slotName: 'target',
    },
    {
      title: '任务用途',
      width: 220,
      dataIndex: 'uses',
      slotName: 'uses',
    },
    {
      title: '任务状态',
      width: 120,
      dataIndex: 'status',
      slotName: 'status',
    },
    {
      title: '任务备注',
      width: 200,
      dataIndex: 'remark',
    },
    {
      title: '开始日期',
      width: 200,
      dataIndex: 'beginDate',
      slotName: 'beginDate',
      sortable: {
        sortDirections: ['ascend', 'descend'],
      },
    },
    {
      title: '结束日期',
      width: 200,
      dataIndex: 'endDate',
      slotName: 'endDate',
      sortable: {
        sortDirections: ['ascend', 'descend'],
      },
    },
    {
      title: '创建人',
      width: 200,
      dataIndex: 'createUserName',
    },
    {
      title: '创建时间',
      width: 200,
      dataIndex: 'createTime',
      slotName: 'createTime',
      sortable: {
        sortDirections: ['ascend', 'descend'],
      },
    },
    {
      title: '操作',
      dataIndex: 'action',
      slotName: 'action',
      width: 203,
      fixed: 'right',
    },
  ]);

  const scroll = reactive({
    x: '120%',
    // y: '100%'
  });

  const total = ref(0);

  const getTableData = async () => {
    const params = { ...searchForm };
    const res = await QueryList(params);
    res && (data.value = res.data.list);
    res && (total.value = res.data.total);
  };

  // 新建任务
  const handeleTaskUserClick = () => {
    ProjectDetailStore.resetFields();
    router.push({
      path: '/dimensioning/projectDetail',
      query: {
        status: 1,
        type: 'create',
      },
    });
  };

  // 查看详情
  const handleQueryDetail = (row: TableListItem) => {
    router.push({
      path: '/dimensioning/projectDetailView',
      query: {
        projectStatus: row.status,
        projectId: row.id,
        /*status: row.status,
        id: row.id,
        type: 'query',*/
      },
    });
  };

  // 编辑详情
  const handleUpdateDetail = (row: TableListItem) => {
    ProjectDetailStore.resetFields();
    router.push({
      path: '/dimensioning/projectDetail',
      query: {
        status: row.status,
        id: row.id,
        type: 'update',
      },
    });
  };

  // 发布、终结任务的弹窗显示值
  const changeStatusVisibile = ref(false);
  // 弹窗内容title
  const bodyTitle = ref('');
  // 弹窗内容tip
  const bodyTip = ref('');
  // 临时存储当前项
  const currentRow = ref();

  // 发布、终结点击 0未发布 1进行中 2已完成 3已终结
  const handleChangeStatus = (row: TableListItem) => {
    currentRow.value = row;
    if (row.status === 0) {
      if (row.seriesCount === 0) {
        bodyTitle.value = '当前项目无影像序列，无法发布！';
        bodyTip.value = ``;
      } else {
        bodyTitle.value = '确认发布任务？';
        bodyTip.value = `本次任务序列数量为${row.seriesCount}个，一旦开始序列数量即为锁定。`;
      }
      changeStatusVisibile.value = true;
    } else {
      bodyTitle.value = '确认终结任务？';
      bodyTip.value = '一旦终结，标注医生的任务即结束，并无法再次发布。';
      changeStatusVisibile.value = true;
    }
  };

  // 发布终结弹窗点击确定
  const handleSubmitClick = async (data: CallBackData) => {
    if (data.status === 'save') {
      data.done(true);
      if (currentRow.value.seriesCount === 0) {
        changeStatusVisibile.value = data.flag;
        return;
      }
      const params = {
        id: currentRow.value.id,
        status: currentRow.value.status === 0 ? 1 : 3,
      };
      const res = await changeStatus(params);
      currentRow.value.status === 0
        ? Message.success('发布成功！')
        : Message.success('终结成功!');
      changeStatusVisibile.value = data.flag;
      getTableData();
    } else if (data.status === 'clear') {
      changeStatusVisibile.value = data.flag;
    }
  };

  // 复制弹窗显示值
  const copyVisibile = ref(false);
  // 复制弹窗点击确定
  const handleCopyClick = async (callback: CallBackData) => {
    if (callback.status === 'save') {
      // 调用复制接口
      const params = {
        taskId: currentRow.value.id,
      };
      const res = await copyTableItem(params);
      Message.success('复制成功！');
      copyVisibile.value = callback.flag;
      getTableData();
    } else {
      copyVisibile.value = callback.flag;
    }
    callback.done(true);
  };

  // 表格下拉菜单点击
  const handleSelect = (
    item: string | number | Record<string, any> | undefined,
    row: TableListItem
  ) => {
    if (item === 'copy') {
      copyVisibile.value = true;
      currentRow.value = row;
    }
    if (item === 'del') {
      Message.info('正在建设中。。。');
      // data.value = data.value.filter(item => item.id !== row.id);
      // Message.success('删除成功！');
    }
    if (item === 'query') {
      router.push({
        path: '/readSeries',
        query: {
          id: row.id,
        },
      });
    }
  };

  return {
    columns,
    data,
    scroll,
    bodyTitle,
    bodyTip,
    dataTotal,
    getTableData,
    handeleTaskUserClick,
    handleQueryDetail,
    handleUpdateDetail,
    changeStatusVisibile,
    handleChangeStatus,
    handleSubmitClick,
    copyVisibile,
    handleCopyClick,
    handleSelect,
    total,
  };
}
